 /* reset */
 * {
 	margin: 0;
 	padding: 0;
 }
 li {
 	list-style: none;
 }

@font-face {
    font-family:sc; 
    src: url('/static/font/Smudgie Crayon.ttf')
}
@font-face {
    font-family:sb; 
    src: url('/static/font/Stylus BT.ttf')
}
body::-webkit-scrollbar { width: 0 !important }

/*end reset*/

/*---index style-----*/

.container_bg {
    width: 100%;
    /*min-height: 500px;*/
    /*height: 100%;*/
    /*background: orange;*/
}
.container_top {
    width: 100%;
    height: 70px;
    background: linear-gradient(to left top, #4facfe, #00f2fe);
    box-shadow: 2px 2px 3px gray;
}
 .container_top .logo {
    text-align: center;
    margin-top: -20px;
 }
.container_top .title {
    font-family: sc;
    font-size: 35px;
    line-height: 70px;
    color: white;

}
.container_top small {
    font-size: 25px;
    margin-left: 35%;
}
.container_mid {
    width: 100%;
    min-height: 700px;
    border: none;
    display: block;
    /*background: green;*/
}
.container_left {
    min-height: 699px;
    width: 15%;
    background: gray;
    float: left;
    border: none;
}
.container_right {
    width: 85%;
    min-height: 699px;
    float: right;
    border: none;
    /*background: yellow;*/
}
.container_bottom {
    width: 100%;
    height: 80px;
    background: black;
}
#nav_open {
    float: right;
    position: relative;
    top: 10px;
    right: 10px;
    cursor: pointer;
}
.container_left nav .avatar {
    text-align: center;
    margin-top: 50px;
}
.container_left nav .avatar img {
    width: 100px;
    /*height: 100px;*/
    border-radius: 10px;
}
.container_left nav .avatar p {
    color: black;
    font-family: sb;
    font-size: 20px;
}
.container_left nav ul {
    text-align: center;
    float: right;
    width: 100%;
}
.container_left nav ul li {
    margin-top: 10px;
    width: 100%;
    height: 40px;
    background: #919191;
    cursor: pointer;
    line-height: 40px;
}
.container_left nav ul li:hover {
    background: white;
}
.container_left nav ul li span {
    margin-right: 20px;
}

/*------books style-------*/

/*-----移动端响应------*/
@media (max-width:1440px){
.message.warning {
		margin: 11% auto 0;
		width: 30%;
	}
	.footer {
	left: 44%;
	}
}
@media (max-width:1366px){
	.message.warning{
		margin: 7% auto 0;
		width: 35%;
	}
	.footer {
		left: 43%;
		bottom: 9%;
	}
}
@media (max-width:1280px){
	.message.warning {
		margin: 7% auto 0;
		width: 33%;
	}
	.footer {
		left: 43%;
	}
}
@media (max-width:1024px){
	.message.warning{
		margin: 12% auto 0;
		width: 47%;
	}
	.footer {
		left: 41%;
	}
}
@media (max-width:768px){
	.message.warning{
		margin: 13% auto 0;
		width: 65%;
	}
	.footer {
		left: 38%;
		bottom:87px;
	}
}
@media (max-width:640px){
	.message.warning{
		margin: 13% auto 0;
		width: 67%;
	}
	.footer {
		left: 35%;
		bottom:87px;
	}
}
@media (max-width:480px){
	.message.warning  {
		margin: 15% auto 0;
		width:90%;
	}
	.footer {
		left: 33%;
		bottom: 136px;
	}
}
@media (max-width:320px){
	.message.warning  {
		margin:8% auto 0;
		width:90%;
	}
	.login-head {
	padding: 1.45em 0;
	}
	.login-head h1 {
	font-size: 1.15em;
	}
	.icon {
		margin: -33px 9px 9px 0px;
	}
	input[type="text"], input[type="password"] {
		font-size: 16px;
	}
	.alert-close {
	right: 12px;
	top: 22px;
	}
	form {
	padding: 1.5em 1.5em;
	}
	.submit {
	padding-top: 0.4em;
	}
	input[type="submit"] {
		float:none;
	padding: 11px 0px;
	width: 52%;
	font-size: 15px;
	}
	.submit h4 {
		margin-top: 15px;
		margin-bottom: 20px;
	}
	.submit h4 a {
	float: none;
	font-size: 15px;
	}
	.footer {
	left: 22%;
	bottom: 59px;
	}
	
}